import { Component } from 'react'
// 引入 Swiper, SwiperItem 组件
import { View,Image,Swiper, SwiperItem } from '@tarojs/components'
import './homeSwiper.less'
//导入图片后再引用
import zhyi from '../../images/zhyi.png'
import ren from '../../images/ren.png'
import wenhua from '../../images/wenhua.png'
import yao from '../../images/yao.png'



export default class HomeSwiper extends Component {
    // componentWillReceiveProps(nextProps) {
    //     // 只要 props.email 改变，就改变 state
    //     const {carousel} = this.props
    //     if (nextProps.carousel.length !== carousel.length) {
    //       this.setState({
    //         current: 0
    //       });
    //     }
    //   }

      /**
     * 生命周期函数–监听小程序页面显示(每次打开页面都会调用一次)
     */
    

    render () {
        return (
          <View>
            <View className='at-row'>
              <View className='at-col at-col-12'>
                <Swiper
                  className='bannerSwiper'
                  indicatorDots='true'
                  indicatorColor='#fff'
                  indicatorActiveColor='#F7BE81'
                  autoplay='true'
                  interval='3000'
                //   current={this.state.current}
                //   onChange={this.swiperChange.bind(this)}
                >
                    <SwiperItem className='bannerItem' key={1}>
                      <Image className='bannerImg' src={zhyi} mode='aspectFill'></Image>
                    </SwiperItem>
                    <SwiperItem className='bannerItem' key={2}>
                      <Image className='bannerImg' src={ren} mode='aspectFill'></Image>
                    </SwiperItem>
                    <SwiperItem className='bannerItem' key={3}>
                      <Image className='bannerImg' src={wenhua} mode='aspectFill'></Image>
                    </SwiperItem>
                    <SwiperItem className='bannerItem' key={4}>
                      <Image className='bannerImg' src={yao} mode='aspectFill'></Image>
                    </SwiperItem>
                </Swiper>
              </View>
            </View>
          </View>
        )
    }
}